<script setup>
import {reactive, ref, h} from 'vue'
import MainTop from "@/components/MainTop.vue";
import FunctionMenu from "@/components/FunctionMenu.vue";
import {useRouter} from "vue-router";
import {getUrlKey} from "@/util/getUrlParam.js";
import axios from "axios";
import webConfig from "@/GlobalParas.js";
import * as icons from '@ant-design/icons-vue';
import SystemUserList from "@/views/systemUser/systemUserList.vue";
import {decrypt} from "@/util/StringOper.js";


let functionPath = ref("首页");
let UserName = ref(decrypt(localStorage.getItem("realName")));

let router = useRouter()

// console.log(router.getRoutes())

function menuItemClick(params, eventObj) {
  // console.log(params);
  // console.log(eventObj);
  if (params.routerPath !== null) {
    functionPath.value = params.funPath
    let routeName = params.label + "_" + params.key;
    // console.log(routeName)
    router.push({name: routeName})
  }
}

function backToFrontpage() {
  functionPath.value="首页"
  router.push({name: "DashBoard"})
}

</script>

<template>
  <div style="height: 100%; width: 100%; overflow-x: hidden;overflow-y: hidden">
  <div class="top">
  <MainTop :CurrentUserName="UserName"UserPic="/src/assets/yao.jpeg"@backToFrontpage="backToFrontpage"></MainTop>
  </div>
  <div class="menu">
    <FunctionMenu @onMenuClick="menuItemClick"></FunctionMenu>
  </div>
  <div class="naviPath"><span style="margin-left: 10px">当前位置：</span>
    <span>{{ functionPath }}</span>
  </div>
  <div class="content-container">
    <div class="content">
      <router-view></router-view>
    </div>
  </div>
  <div class="bottom">
    瀚岳团队技术支持:姚磊岳、甘初豪、徐升炎、邢奥杰、杜思寒、党一鸣、邹梓彭
  </div>
  </div>
</template>

<style scoped>
.top {
  background-color: #367dff;
  height: 60px;
  line-height: 60px;
}

.menu {
  background-color: #3c414a;
  color: #fff;
  height: calc(100% - 90px);
  width: 220px;
  float: left;
  font-size: 20px;
  font-family: "等线", "宋体", "Times New Roman", Times, serif;
}

.naviPath {
  height: 40px;
  line-height: 40px;
  font-family: "宋体", Times, serif;
  font-size: 14px;
  color: #042d68;
  border-bottom: 1px solid #cacaca;
}

.content {
  height: calc(100% - 60px);
  background: #dddddd;
  padding: 10px ;
  overflow-x: hidden;
}

.bottom {
  background-color: #367dff;
  color: #fff;
  height: 30px;
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
  line-height: 30px;
  font-size: 12px;
  font-family: "宋体", "Times New Roman", Times, serif;
}

.content-container {
  float: left;
  width: calc(100% - 220px);
  height: calc(100% - 90px);
  overflow-y: auto;
  overflow-x: hidden;
}
</style>